<template>
<div>
     <el-row :gutter='20'>
        <el-col :span='7'>
            <me-link></me-link>
            <me-notice></me-notice>
        </el-col>
        <el-col :span='17' class='main-cont'>
            <me-title :title='title'></me-title>
            <br>
            <div class='box-data-info'>
                <div class='title'>
                    <div class='name'>基本操作方法</div>
                    <!-- <div class='date'>2018-07-28</div> -->
                </div>
                <div class='article basic-article'>
                    <div class="title">一.基本操作</div>
										<table class="basic-table" cellspacing="0">
											<thead>
												<tr>
													<th style="width:200px;">操作</th>
													<th>内容</th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<td>鼠标左键</td>
													<td>移动、NPC对话・买卖、选取目标、拾取地面掉落道具</td>
												</tr>
												<tr>
													<td>鼠标左键长按</td>
													<td>随鼠标方向移动</td>
												</tr>
												<tr>
													<td>鼠标右键</td>
													<td>选中目标进行对话或攻击<br>装备物品</td>
												</tr>
												<tr>
													<td>鼠标右键长按</td>
													<td>视角转变</td>
												</tr>
												<tr>
													<td>右键单击您的角色</td>
													<td>显示您的角色操作菜单<br>(人型)･･･坐下、睡觉、变身为神甲兵、变更昵称、写一条消息<br>(神甲)･･･变身为人型、变更昵称、写一条消息</td>
												</tr>
												<tr>
													<td>右键单击其他玩家</td>
													<td>私人信息<br>邀请交易<br>追加至好友名单</td>
												</tr>
												<tr>
													<td>双击背包的物品</td>
													<td>使用消费品，如恢复道具和传送卷轴<br>装备物品</td>
												</tr>
												<tr>
													<td>双击装备栏中的物品</td>
													<td>物品脱下</td>
												</tr>
												<tr>
													<td>小地图上使用Ctrl＋左键</td>
													<td>自动寻路到指定地点</td>
												</tr>
												<tr>
													<td>右键双击小地图</td>
													<td>在小地图上附加带有名称的标记（Ctrl +右键单击以删除地标）</td>
												</tr>
												<tr>
													<td>单击鼠标滚轮</td>
													<td>向北重置视角</td>
												</tr>
											</tbody>
										</table>
                    <div class="title">二.视角操作</div>
											<table class="basic-table" cellspacing="0">
												<thead>
													<tr><th style="width:200px;">操作</th><th>内容</th></tr>
												</thead>
												<tbody>
													<tr v-for="item in operation.visual" :key="item.id">
														<td>{{item.td1}}</td>
														<td>{{item.td2}}</td>
													</tr>
												</tbody>
											</table>
                    <div class="title">三.快捷键关联</div>
										<table class="basic-table" cellspacing="0">
											<thead>
												<tr><th style="width:200px;">按键</th><th>内容</th></tr>
											</thead>
											<tbody>
												<tr v-for="item in operation.ShortcutkeyRelation" :key="item.id">
													<td>{{item.td1}}</td>
													<td>{{item.td2}}</td>
												</tr>
											</tbody>
										</table>
                    <div class="title">四.快捷键</div>
										<table class="basic-table" cellspacing="0">
											<thead>
												<tr><th style="width:200px;">按键</th><th>内容</th></tr>
											</thead>
											<tbody>
												<tr v-for="item in operation.Shortcutkey" :key="item.id">
													<td>{{item.td1}}</td>
													<td>{{item.td2}}</td>
												</tr>
											</tbody>
										</table>
                    <div class="title">五.快捷键基本操作</div>
										<table class="basic-table" cellspacing="0">
											<thead>
												<tr><th style="width:200px;">按键</th><th>内容</th></tr>
											</thead>
											<tbody>
												<tr v-for="item in operation.ShortcutkeyBasic" :key="item.id">
													<td>{{item.td1}}</td>
													<td>{{item.td2}}</td>
												</tr>
											</tbody>
										</table>
                </div>
            </div>
        </el-col>
    </el-row>
</div>
</template>

<script type="text/javascript">
import Link from '@/components/utils/Link'
import Notice from '@/components/utils/Notice'
import Title from '@/components/utils/Title'
import ScrollReveal from 'scrollreveal'
export default {
    components : {
        'me-link' : Link,
        'me-notice' : Notice,
        'me-title' : Title
    },
    data : function(){
        return {
            'title' : {
                'name' : '游戏资料',
                'sub' : 'GAME DATA',
                'posi' : '位置 > ',
                'now' : '游戏资料',
                'icon' : '/static/image/data/icon-title.png'
            },
            'dataLinks' : [
                {
                    'title' : '游戏介绍',
                    'children' : [
                        {
                            'title' : '背景介绍',
                            'url' : ''
                        },{
                            'title' : '任务指引',
                            'url' : ''
                        },{
                            'title' : '职业树',
                            'url' : ''
                        }
                    ]
                },{
                    'title' : '特色系统',
                    'children' : [
                        {
                            'title' : '战斗系统',
                            'url' : ''
                        },{
                            'title' : '工会系统',
                            'url' : ''
                        },{
                            'title' : '连击系统',
                            'url' : ''
                        },{
                            'title' : '房屋系统',
                            'url' : ''
                        }
                    ]
                },{
                    'title' : '玩法介绍',
                    'children' : [
                        {
                            'title' : '机甲DIY',
                            'url' : ''
                        },{
                            'title' : '一转机甲',
                            'url' : ''
                        },{
                            'title' : '二转机甲',
                            'url' : ''
                        }
                    ]
                },{
                    'title' : '商店系统',
                    'children' : [
                        {
                            'title' : '游戏商店',
                            'url' : ''
                        }
                    ]
                }
						],
						operation:{
							visual:[
								{
									td1:'鼠标滚轮',
									td2:'放大，缩小'
								},{
									td1:'鼠标右键拖动左右移动',
									td2:'左右旋转场景'
								},
							],
							ShortcutkeyRelation:[
								{
									td1:'小地图上使用Ctrl＋左键',
									td2:'自动寻路到指定地点'
								},{
									td1:'右键双击小地图',
									td2:'在小地图上附加带有名称的标记（Ctrl +右键单击以删除地标）'
								},{
									td1:'鼠标',
									td2:'向北重置视角'
								}
							],
							Shortcutkey:[
								{
									td1:'Q',
									td2:'任务面板'
								},{
									td1:'E',
									td2:'装备面板'
								},{
									td1:'R',
									td2:'神甲兵面板'
								},{
									td1:'T',
									td2:'任务属性'
								},{
									td1:'Y',
									td2:'活动窗口'
								},{
									td1:'I',
									td2:'背包物品'
								},{
									td1:'O',
									td2:'使用表情（快捷键Alt + 0到9，Ctrl + 9）。'
								},{
									td1:'P',
									td2:'小队面板'
								},{
									td1:'F',
									td2:'好友'
								},{
									td1:'G',
									td2:'公会'
								},{
									td1:'H、J',
									td2:'商城仓库'
								},{
									td1:'K',
									td2:'技能面板'
								},{
									td1:'M',
									td2:'大地图'
								},{
									td1:'ESC',
									td2:'退出选择'
								}
							],
							ShortcutkeyBasic:[
								{
									td1:'F1～F12',
									td2:'技能施放栏'
								},{
									td1:'ESC',
									td2:'退出选择'
								},{
									td1:'WASD',
									td2:'对应前后左右移动'
								},{
									td1:'W',
									td2:'前进'
								},{
									td1:'S',
									td2:'后退'
								},{
									td1:'A',
									td2:'右移动'
								},{
									td1:'D',
									td2:'左移动'
								},{
									td1:'Q',
									td2:'任务'
								},{
									td1:'E',
									td2:'装备'
								},{
									td1:'R',
									td2:'神甲兵装备'
								},{
									td1:'T',
									td2:'角色状态'
								},{
									td1:'Y',
									td2:'活动'
								},{
									td1:'U',
									td2:'放出，收起武器'
								},{
									td1:'I',
									td2:'背包物品'
								},
								{
									td1:'O',
									td2:'表情管理（按ALT+1~0、CTRL+1~0施放表情）'
								},{
									td1:'P',
									td2:'小队'
								},{
									td1:'F',
									td2:'好友'
								},{
									td1:'G',
									td2:'公会'
								},{
									td1:'H、J',
									td2:'商城仓库'
								},{
									td1:'K',
									td2:'技能'
								},{
									td1:'C',
									td2:'变身神甲兵'
								},{
									td1:'V',
									td2:'跪下'
								},{
									td1:'B',
									td2:'左下'
								},{
									td1:'N',
									td2:'躺下'
								},{
									td1:'M',
									td2:'大地图'
								},{
									td1:'/',
									td2:'快捷会话'
								},{
									td1:'Space /Shift',
									td2:'显示物品'
								},{
									td1:'Ctrl＋P',
									td2:'游戏截图'
								},{
									td1:'Alt＋End',
									td2:'状态显示'
								},{
									td1:'Alt＋M',
									td2:'小地图'
								},{
									td1:'Alt＋C',
									td2:'热心指导员'
								},{
									td1:'Alt＋L',
									td2:'会话窗口'
								}
							]
						}
        }
    },
    mounted : function(){
        var sr = ScrollReveal({
            'origin' : 'bottom',
            'distance' : '20px',
            'duration' : 500,
            'delay' : 400
        })

        sr.reveal('.main-cont')
    }
}
</script>